<div class="col-xs-8" style="height:100%">
    <div id="recheck-equipment-line" style="height: 100%">

    </div>
</div>
<div class="col-xs-4" style="height:100%">
    <div id="recheck-equipment-pie" style="height: 100%">

    </div>
</div>
<script type="text/javascript">

    $.ajax({
        url: "#springUrl('/simulation/resource')",
        data: {"batchId": "$!{batchId}","index":"29"},
        type: "POST",
        success: function (text) {
            var d = JSON.parse(text);
            if (d.success && d.data) {
                var myChart1 = echarts.init(document.getElementById('recheck-equipment-line'), 'macarons');
                myChart1.setOption({
                    title: {
                        text: '卸货设备闲忙趋势'
                    },
                    tooltip: {
                        trigger: 'axis',
                        formatter: function (params) {
                            return params[0].name + "<br/>" + params[0].value + "%";
                        },
                        axisPointer: {
                            animation: false
                        }
                    },
                    xAxis: {
                        type: 'category',
                        data: d.data.date,
                        axisLabel:{
                            show:true,
                            textStyle:{
                                color:"#595959"
                            }
                        },
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                    },
                    grid: {
                        left: '3%',
                        right: '6.5%',
                        bottom: '15%',
                        top:'12%',
                        containLabel: true
                    },
                    yAxis: {
                        type: 'value',
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            formatter: function(value){
                                var var1=value*1;
                                return var1;
                            },
                            textStyle:{
                                color:"#595959"
                            }
                        },
                        splitLine:{
                            show:true
                        },
                        splitArea: {
                            show:true,
                            areaStyle: {
                                color: ['rgba(0,0,0,0)', 'rgba(0,0,0,0)']
                            }
                        },
                    },
                    dataZoom: [{
                        type: 'inside',
                        start: 0,
                        end: 10
                    }, {
                        start: 0,
                        end: 10,
                        handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
                        handleSize: '80%',
                        handleStyle: {
                            color: '#fff',
                            shadowBlur: 3,
                            shadowColor: 'rgba(0, 0, 0, 0.6)',
                            shadowOffsetX: 2,
                            shadowOffsetY: 2
                        }
                    }],
                    series: [{
                        name: '卸货设备',
                        type: 'line',
                        showSymbol: false,
                        hoverAnimation: false,
                        data: d.data.line
                    }]
                });
                var myChart2 = echarts.init(document.getElementById('recheck-equipment-pie'), 'macarons');
                myChart2.setOption({
                    title: {
                        text: '卸货设备忙时占比分析',
                        x: 'center'
                    },
                    tooltip: {
                        trigger: 'item',
                        formatter: "{a} <br/>{b} : {c} ({d}%)"
                    },
                    series: [
                        {
                            name: '闲忙占比',
                            type: 'pie',
                            radius: '55%',
                            center: ['50%', '60%'],
                            data: d.data.pie,
                            itemStyle: {
                                emphasis: {
                                    shadowBlur: 10,
                                    shadowOffsetX: 0,
                                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                                },
                                normal: {
                                    //好，这里就是重头戏了，定义一个list，然后根据所以取得不同的值，这样就实现了，
                                    color: function(params) {
                                        // build a color map as your need.
                                        var colorList = [
                                            '#0fa99d','#d9d9d9','#4472c4','#c9eee7','#e7a14c',
                                            '#787473','#9BCA63','#FAD860','#F3A43B','#60C0DD',
                                            '#D7504B','#C6E579','#F4E001','#F0805A','#26C0C0'
                                        ];
                                        return colorList[params.dataIndex]
                                    },
                                    //以下为是否显示，显示位置和显示格式的设置了
                                }
                            }
                        }
                    ]
                })
            }
        }
    });
</script>